<%@ taglib prefix="form" uri="http://www.springframework.org/tags/form"%>
<%@ taglib uri="http://java.sun.com/jsp/jstl/functions" prefix="fn"%>
<%@ taglib uri="http://java.sun.com/jsp/jstl/core" prefix="c"%>

<link rel="stylesheet" type="text/css" href="${pageContext.request.contextPath}/css/reset.css" />
<link rel="stylesheet" type="text/css" href="${pageContext.request.contextPath}/css/styles.css" />

<script language="javascript" type="text/javascript"
	src="${pageContext.request.contextPath}/js/jquery-1.9.0.min.js"></script>
	
<script language="javascript" type="text/javascript"
	src="${pageContext.request.contextPath}/js/course.js"></script>
<script language="javascript" type="text/javascript"
	src="${pageContext.request.contextPath}/js/common.js"></script>
<script language="javascript" type="text/javascript"
	src="${pageContext.request.contextPath}/js/register.js"></script>

<script>
  
   function reload(actionType){
      //document.getElementById("courseViewType").value = actionType;
	  document.forms[1].action = "${pageContext.request.contextPath}/usr/course/view/"+actionType;
	  document.forms[1].submit();
   }
</script>

<form:form action="${pageContext.request.contextPath}/usr/course/view/" method="POST" commandName="courseSearchResultPageBean">

<form:hidden id="courseViewType" path="courseViewType"/>

<div class="right-area">
	<div class="left-arrow">
		<img src="images/arrow-left.png" width="11" height="16" alt="" />
	</div>
	<div class="container">
		<div class="content">
			<div class="three-column-work-area advance-search">
				<div class="tab">

					<ul class="tab-list">
						<!-- <li class="btn active first"><a href="javascript:void(0);" onclick="showtab('cont-registred');">Registered</a></li>
								<li class="btn last" style="margin-right:15px;"><a href="javascript:void(0);" onclick="showtab('cont-attended');">Attended</a></li>
								<li class="btn first"><a href="javascript:void(0);" onclick="showtab('cont-saved-template');">Saved Template</a></li>
								<li class="btn"><a href="javascript:void(0);" onclick="showtab('cont-taken');">Taken</a></li>
								<li class="btn"><a href="javascript:void(0);" onclick="showtab('cont-upcoming');">Scheduled</a></li>
								<li class="btn last"><a href="javascript:void(0);" onclick="showtab('cont-drafted');">Drafted</a></li> -->

						<!-- <li class="left-btn">10,000 rows</li> -->
						<li class="left-btn" style="float: right;">
							<div class="selbox">
								<div class="selactive">
									Registered <span class="menu-sep"></span>
								</div>
								<ul>
									<li><a href="javascript:void(0);">Registered</a></li>
									<li><a href="javascript:void(0);">Attended</a></li>
									<li><a href="javascript:void(0);">Saved Template</a></li>
									<li><a href="javascript:reload('taken');">Taken</a></li>
									<li><a href="javascript:void(0);">Scheduled</a></li>
									<li class="last"><a href="javascript:void(0);">Drafted</a></li>
								</ul>
							</div>
						</li>
						<li class="right-btn"><a href="${pageContext.request.contextPath}/usr/course/new">Create Course</a><a href="${pageContext.request.contextPath}/usr/course/req/new">Request Course</a></li>
					</ul>
				</div>
				<div class="tab-content-no" style="overflow: inherit;">
					<div class="cont-tab cont-registred">
						<ul class="list-course">
						
						<c:forEach items="${courseSearchResultPageBean.resultsBeans}" var="course" varStatus="reStatus">
						
							<li class="odd">
								<div class="content-para">
									<div class="search-details">
										<div class="class-left">
											<div class="class-hd">
												<a href="${pageContext.request.contextPath}/usr/course/${course.courseId}/details"><c:out value="${course.courseTitle}" /></a>
											</div>
											<!-- <h3 class="class-search clear">
												<span class="title">Trainer</span> : <b><a href="">Baskar</a></b>
											</h3> -->
											<h3 class="class-search clear">
												<span class="title">Date From</span> : <b><c:out value="${course.stDate}" /></b>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;To
												: <b><c:out value="${course.endDate}" /></b>
											</h3>
											<h3 class="class-search clear">
												<span class="title">Time From</span> : <b><c:out value="${course.stTime}" /></b>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;To
												: <b><c:out value="${course.endTime}" /></b>
											</h3>
											<h3 class="class-search clear">
												<span class="title">Venue</span> :
												<div class="val">
													<b class="less-data"><c:out value="${course.venue}" />... <a
														href="javascript:void(0);" class="more">more</a></b> <b
														class="more-data"><c:out value="${course.venue}" /> <br />
													<a href="javascript:void(0);" class="google-map">View
															on Google Map</a>&nbsp;&nbsp;<a href="javascript:void(0);"
														class="less">less...</a>
													</b>
												</div>
											</h3>
											<h3 class="class-search clear"></h3>
										</div>
										<h3 class="class-search right-search"
											style="float: right; text-align: right; padding-top: 3px;">
											<div class="fright"
												style="display: block; padding-bottom: 5px;">
												<div class="selbox-inner">
													<div class="selactive">
														Share <span class="menu-sep"></span>
													</div>
													<ul>
														<li><a href="javascript:void(0);">Refer a Friend</a></li>
														<li><a href="javascript:void(0);">Add to Google
																Calendar</a></li>
														<li><a href="javascript:void(0);">Add to
																Microsoft Calendar</a></li>														
														<li class="last"><a href="javascript:void(0);">Cancel</a></li>
													</ul>
												</div>
											</div>
											<div class="fright"
												style="display: block; overflow: hidden; padding-bottom: 3px;">
												<span style="width: 50px;">Fees</span> : <b
													class="big  light-clr"><c:out value="${course.fee}" /></b>
											</div>
											<div class="fright"
												style="display: block; overflow: hidden; padding-bottom: 3px;">
												<span style="width: 70px;">Registered</span> : <b
													class="big  light-clr"><c:out value="${course.totalRegistered}" /></b>
												
											</div>											
											<div class="fright" style="display: block;">
												<b>Online</b>
											</div>
										</h3>
									</div>
									<p class="para">
										<span class="title">Skill Set :</span> <span class="less-data"><c:out value="${course.skillSets}" />... 
										<a href="javascript:void(0);" class="more">more</a>
										</span> <span class="more-data"><c:out value="${course.skillSets}" />&nbsp;&nbsp;<a
											href="javascript:void(0);" class="less">less...</a>
										</span>
									</p>
								</div>
							</li>
							
							</c:forEach>
							
							
						</ul>
					</div>
				</div>
			</div>
		</div>
	</div>
	<div class="sidebar">
		<h2>Category</h2>
		<ul class="list">
			<li><input type="checkbox" />
				<div class="list-cont">IT Consultancy</div></li>
			<li><input type="checkbox" />
				<div class="list-cont">IT Consultancy</div></li>
			<li><input type="checkbox" />
				<div class="list-cont">IT Consultancy</div></li>
			<li><input type="checkbox" />
				<div class="list-cont">IT Consultancy</div></li>
			<li><input type="checkbox" />
				<div class="list-cont">IT Consultancy</div></li>
			<li><input type="checkbox" />
				<div class="list-cont">IT Consultancy</div></li>
		</ul>		
	</div>
</div>

</form:form>